<template>
	<a-modal :title="model=='1'?'新增电子卡券':'编辑电子卡券'" :width="640" :visible="visible" :confirmLoading="loading"
		@ok="handleOk" @cancel="handleCancel">
		<a-spin :spinning="loading">
			<a-form layout='horizontal'>
				<a-form-item label="是否制卡" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-select v-model="cardInfo.is_docard" :allowClear='true'  placeholder="请选择">
					  <a-select-option value="1">制卡</a-select-option>
					  <a-select-option value="2">不制卡</a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item label="卡券名称" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='卡券名称' v-model="cardInfo.name" :allowClear='true' />
				</a-form-item>
				<a-form-item label="衣服数量" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='衣服数量' type='number' v-model="cardInfo.clothes_num" :allowClear='true' />
				</a-form-item>
				<a-form-item label="发放数量" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='发放数量' v-model="cardInfo.send_nums" :allowClear='true' type='number'/>
				</a-form-item>
				<a-form-item label="使用次数" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='使用次数' v-model="cardInfo.total_number" :allowClear='true' type='number'/>
				</a-form-item>
				<a-form-item label="选择门店" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-select v-model="cardInfo.store_id" :allowClear='true'  placeholder="请选择门店">
					  <a-select-option value="" disabled>请选择门店</a-select-option>
					  <a-select-option :value="item.id" v-for="(item,index) in storeList" :key='item.id'>{{item.name}}</a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item label="周期" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='天数' v-model="cardInfo.cycle" :allowClear='true' type='number'/>
				</a-form-item>
				<a-form-item label="价格" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-input placeholder='请输入价格' v-model="cardInfo.price" :allowClear='true'/>
				</a-form-item>
				<!-- <a-form-item label="有效期" :wrapperCol='wrapperCol' :labelCol="labelCol">
					<a-range-picker v-model='cardInfo.range' class="medio-width" valueFormat='YYYY/MM/DD' format="YYYY/MM/DD" :showTime='false' allowClear @change='exchangeTime'/>
				</a-form-item> -->
			</a-form>
		</a-spin>
	</a-modal>
</template>



<script>
	import {
		cardAdd,
		cardEdit,
		storeList
	} from '@/api/electronCard'
	export default {
		props: {
			model: {
				type: String,
				default: '1',
			},
			visible: {
				type: Boolean,
				default: false,
			},
			cardInfo:{
				default: {
					id:'',
					is_docard:'',
					name: '',
					cycle:'',
					store_id:'',
					clothes_num:'',
					total_number:'',
					send_nums: '',
					price:'',
					// start_time:'',
					// end_time:'',
					// range: [],
				},
			}
		},
		data() {
			return {
				loading: false,
				labelCol: {
					style: {
						width: '80px',
					},
				},
				wrapperCol:{
					style: {
						width: '350px',
						display:'inline-block',
					},
				},
				storeList:[],
			}
		},
		created(){
			this.initStore();
		},
		methods: {
			// 门店列表
			initStore(){
				storeList().then(res=>{
					if(res.status == 0){
						this.storeList = res.data;
					}
				})
			},
			// 有效期处理
			exchangeTime(e){
				this.cardInfo.start_time = this.cardInfo.range[0];
				this.cardInfo.end_time = this.cardInfo.range[1];
			},
			// 提交设置
			handleOk() {
				if(!this.cardInfo.name){
					this.$message.error('卡券名称不能为空');
					return
				}
				if(!this.cardInfo.send_nums){
					this.$message.error('发放数量不能为空');
					return
				}
				if(!this.cardInfo.clothes_num){
					this.$message.error('衣服数量不能为空');
					return
				}
				if(!this.cardInfo.store_id){
					this.$message.error('请选择门店');
					return
				}
				// if(this.cardInfo.range.length != '2'){
				// 	this.$message.error('有效期不能为空');
				// 	return
				// }
				this.loading = true;
				if(this.model == '1'){
					cardAdd(this.cardInfo).then(res=>{
						this.loading = false;
						if(res.status == '0'){
							this.$emit('closeModal');
						}else{
							this.$message.error(res.msg);
						}
					})
				}else{
					cardEdit(this.cardInfo).then(res=>{
						this.loading = false;
						if(res.status == '0'){
							this.$emit('closeModal');
						}else{
							this.$message.error(res.msg);
						}
					})
				}
			},
			handleCancel() {
				this.$emit('closeModal');
			},
		}
	}
</script>